<template>
  <div class="enterpriseManage_page">
    <van-nav-bar
      title="企业管理（我提交认证的企业）"
      left-arrow
      @click-left="$router.push('/mine')"
    />
    <div v-if="companyList.length" class="all_company_data">
      <div class="company_arr">
        <van-row type="flex"
                 justify="space-between"
                 v-for="(item, index) in companyList"
                 :key="index"
                 class="company_detail"
                 @click="toEnterpriseDetail(item.id)"
        >
          <van-col span="8">
              <van-image
                cover
                width="2.8rem"
                height="2.8rem"
                :src="item.logo ? item.logo : Zanwu"
                style=" vertical-align: bottom;"
              />
            <div style="margin-top: 8px; font-weight: bolder; font-size: 15px;">{{item.name}}</div>
          </van-col>
          <van-col span="16">
            <!--  层层嵌套   -->
            <van-row type="flex" justify="start" align="center" style="text-align: left">
              <van-col span="24">
                <div>审核状态：<van-tag size="medium" :type="allStatus[item.audit_state]">{{item.audit_state_desc ? item.audit_state_desc: '未知'}}</van-tag></div>
                <div style="margin-top: 8px">{{'法人：' + (item.legal_name ? item.legal_name: '暂无')}}</div>
                <div style="margin-top: 8px;">{{'法人身份证：' + (item.legal_cardno ? item.legal_cardno: '暂无')}}</div>
                <div style="margin-top: 8px">{{'企业电话：' + (item.line_phone ? item.line_phone: '暂无')}}</div>
                <div style="margin-top: 8px;">{{'营业执照：' + (item.business_license_number ? item.business_license_number: '未知')}}</div>
                <div style="margin-top: 8px">{{'联系人：' + (item.line_user_name ?  item.line_user_name : '暂无')}}</div>
                <div style="margin-top: 8px">{{'联系人电话：' + (item.line_user_mobile ? item.line_user_mobile : '暂无')}}</div>
                <div style="margin-top: 8px">{{'QQ：' + (item.qq_num ? item.qq_num : '暂无')}}</div>
                <div style="margin-top: 8px">{{'微信：' + (item.wx_num ? item.wx_num : '暂无')}}</div>
                <div style="margin-top: 8px">{{'邮箱：' + (item.email ? item.email : '暂无')}}</div>

                <van-row type="flex" style="margin-top: 8px">
                  <van-col span="6">公司地址: </van-col>
                  <van-col span="18">{{(item.regions.full_address ? item.regions.full_address: '暂无')}}</van-col>
                </van-row>

              </van-col>
            </van-row>





          </van-col>
        </van-row>

      </div>
      <!-- 分页  -->
      <!--<van-pagination
        v-model="pageIndex"
        style="margin-top: 8px"
        :total-items="total"
        :items-per-page="pageSize"
        force-ellipses
        @change="handleChangePageNum"
      />-->
    </div>

    <van-divider style="margin-top: 80px" v-else>暂无数据</van-divider>

  </div>
</template>

<script>
  import Zanwu from '@/assets/zanwu.png';

  const allStatus = {
    0: 'primary',
    1: 'warning',
    2: 'success',
    3: 'danger',
  };



  export default {
    name: 'enterpriseManage',
    data(){
      return {
        Zanwu,
        allStatus,
        companyList: [],
        pageIndex: 1,
        pageSize: 20,
        total: 0,
      }
    },

    mounted(){
      const params = {
        pageIndex: this.pageIndex,
        pageSize: this.pageSize,
      };
      this._getInitPage(params)
    },

    methods: {
      async _getInitPage(params){
        const res = await this.$api.authentication.reqMyEnterpriseList(params);
        if (res.code === 200){
          this.companyList = res.data.data
          this.total = res.data.total
        }
      },

      toEnterpriseDetail(id){
        // 三种动态路由： https://www.jianshu.com/p/d276dcde6656
        this.$router.push({
            path: `/enterpriseDetail/${id}`
        })
      },

      // 点击分页
      handleChangePageNum(value){
        const params = {
          pageIndex: value,
          pageSize: this.pageSize,
        };
        this._getInitPage(params)
      },


    }
  }
</script>

<style lang="scss" scoped>
  .enterpriseManage_page{
    width: 100%;
    box-sizing: border-box;
    .all_company_data{
      .company_arr{
        background-color: #FFFFFF;
        font-size: 13px;
        .company_detail{
          padding: 8px 2px;
          text-align: center;
          border-bottom: 1px solid #eee;
        }
      }
    }
  }
</style>
